<template>
  <div id="app">
    <router-view />
    <gb-Loading v-model="isShow" :text="text"></gb-Loading>
    <div v-drag class="kefu">
      <i class="iconfont icon-kefu" style="fontsize: 30px"></i>
    </div>
    <van-icon
      name="arrow-up"
      v-scrollToTop="{ speed: 1, distance: 30 }"
      v-drag
      class="backTopArrow"
    />
  </div>
</template>
<script>
import { mockuserlogin, cookingUserListDetail } from '@/apis/index'

export default {
  name: 'App',
  provide() {
    return {
      app: this
    }
  },
  data() {
    return {
      el: null,
      data: 1,
      isShow: false,
      text: '',
      active: true,
      istest: true,
      foo: true
    }
  },
  computed: {},
  mounted() {
    cookingUserListDetail({
      departmentIds: [],
      diningHallId: -9999,
      endTime: 1634140799999,
      periodNameId: -9999,
      pickUpStatus: -9999,
      startTime: 1634054400000
    }).then((res) => {
      console.log(res)
    })
    // 监听
    this.$on('showLoading', (text) => {
      this.isShow = text !== null
      this.text = text
    })
    mockuserlogin().then((res) => {
      console.log(res)
    })
    window.$app = this
  },
  methods: {}
}
</script>
<style lang="less" scoped>
#app {
  position: relative;
  width: 100%;
  height: 100%;
  // height: 2000px;
}
.backTopArrow {
  right: 20px;
  bottom: 500px;
  width: 100px;
  height: 100px;
  line-height: 100px;
  text-align: center;
  background-color: cadetblue;
  border-radius: 50%;
}
.kefu {
  position: fixed;
  width: 100px;
  height: 100px;
  line-height: 100px;
  text-align: center;
  background-color: bisque;
  right: 0;
  bottom: 20px;
  z-index: 1;
  cursor: pointer;
  border-radius: 10px;
  box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.4);
}
.active {
  font-size: 75px;
}
.test {
  color: aqua;
}
.ss {
  background: aquamarine;
}
</style>
